<template>
  <div style="position: relative">
    <!--    <SearchDialog class="dialog"/>-->
    <HETTable1
      ref="operationLogTable"
      :tableData="data.tableData"
      :tHead="data.tHead"
      :total="data.total"
      :needSearch="true"
      @getTableData="getOperationLogList"
    >
      <template #timestamp>
        <el-table-column label="操作时间" width="200">
          <template #default="scope">
            {{ moment(scope.row.timestamp).format("YYYY-MM-DD HH:mm:ss") }}
          </template>
        </el-table-column>
      </template>
      <template #result>
        <el-table-column label="结果" width="100">
          <template #default="scope">
            {{ scope.row.result == 1 ? "成功" : "失败" }}
          </template>
        </el-table-column>
      </template>
    </HETTable1>
  </div>
</template>

<script setup>
import { ref, reactive, onMounted, markRaw } from "vue";
import moment from "moment";
import { req_getOperationLogs, req_getOperationLogsCount } from "~/utils/axios/index.js";

const operationLogTable = ref();

onMounted(() => {});
const data = reactive({
  tHead: [
    {
      label: "操作时间",
      prop: "timestamp",
      isCustom: true,
      slotName: "timestamp",
    },
    { label: "操作用户", prop: "user", isCustom: false, width: 120 },
    { label: "用户IP", prop: "user_ip", isCustom: false, width: 180 },
    { label: "模块类型", prop: "subServiceType", isCustom: false, width: 120 },
    { label: "执行动作", prop: "operationName", isCustom: false, width: 200 },
    { label: "描述", prop: "comment", isCustom: false },
    { label: "结果", prop: "result", isCustom: true, slotName: "result" },
  ],
  tableData: [],
  total: null,
});

// 获取表格数据
const getOperationLogList = async (initTableParams, searchKeys) => {
  operationLogTable.value.loading();
  let params = {
    $filter: `((contains(comment,'${searchKeys}')))`,
    $skip: initTableParams.page * initTableParams.size,
    $limit: initTableParams.size,
  };
  try {
    const { data: res } = await req_getOperationLogs(params);
    const { data: count } = await req_getOperationLogsCount({
      $filter: `((contains(comment,'${searchKeys}')))`,
    });
    operationLogTable.value.finish();
    data.tableData = res || [];
    data.total = count || 0;
  } catch (err) {
    operationLogTable.value.finish();
  }
};
</script>

<style lang="scss" scoped>
.dialog {
  position: absolute;
  top: 0;
  left: 230px;
}
</style>
